<template>
  <div>
    <BasicTable @register="registerTable" @fetch-success="onFetchSuccess" ref="tableRef">
      <template #action="{ record }">
        <TableAction
          :actions="[
            {
              label: '删除',
              icon: 'ant-design:delete-outlined',
              color: 'error',
              popConfirm: {
                title: '是否确认删除',
                confirm: handleDelete.bind(null, record),
              },
            },
          ]"
        />
      </template>
    </BasicTable>
  </div>
</template>
<script lang="ts">
  import { defineComponent, reactive, toRefs, unref, ref } from 'vue';

  import { BasicTable, useTable, TableAction, TableActionType } from '/@/components/Table';
  import { oauthTokenList, deleteoauthToken } from '/@/api/backs/system/oauth';

  import { columns, searchFormSchema } from './components/tableData';
  import { message } from 'ant-design-vue';

  export default defineComponent({
    name: 'MenuManagement',
    components: { BasicTable, TableAction },
    props: {},
    setup() {
      const tableRef = ref<Nullable<TableActionType>>(null);
      const getTableAction = () => {
        const tableAction = unref(tableRef);
        if (!tableAction) {
          throw new Error('tableAction is null');
        }
        return tableAction;
      };

      const [registerTable, { reload, setSelectedRowKeys }] = useTable({
        title: '岗位列表',
        api: oauthTokenList,
        columns,
        formConfig: {
          labelWidth: 100,
          schemas: searchFormSchema,
        },
        useSearchForm: true,
        showTableSetting: true,
        showIndexColumn: false,
        actionColumn: {
          title: '操作',
          dataIndex: 'action',
          slots: { customRender: 'action' },
          fixed: 'right',
        },
      });
      const getSelectRowList = () => {
        return getTableAction().getSelectRows();
      };
      const setSelectedRowKeyList = (arr) => {
        setSelectedRowKeys(arr);
      };
      const data: any = reactive({
        type: 'add',
      });
      //删除
      const handleDelete = async (record: Recordable) => {
        try {
          await deleteoauthToken({ id: record.id });
          message.success('删除成功！');
          reload();
        } catch (error) {}
      };
      function onFetchSuccess() {}

      return {
        ...toRefs(data),
        tableRef,
        registerTable,
        handleDelete,
        onFetchSuccess,
        getSelectRowList,
        setSelectedRowKeyList,
      };
    },
  });
</script>
